.container {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
    height: 100%;
}

.circleandtext {
    position: absolute;
    left: 50%;
    top: 55%;
    transform: translate(-50%, -50%); // 向左上方移动自身宽高的一半
}

.circleContainer {
    display: flex;
    justify-content: center;
    position: relative;
    width: fit-content; // 或者指定宽度 //使用 width: fit-content 可以让容器只包裹这个圆形区域，而不会无故扩展。
}

// 新增样式：用于包裹 Switch 和 circleContainer 的容器
.switchWrapper {
    display: flex;
    flex-direction: column;
    align-items: center;
    position: relative;
    width: 100%;
    height: auto;
}


.switchBottom {
    z-index: 60;
    --switch-width: 70px;
    --switch-height: 25px;
    --switch-node-size: 25px;
}

.overlayImage {
    z-index: 0;
    position: absolute;
    width: 100%;
    height: 87.74%;
    // width: 265px;
    // height: 265px;
    // height: 232.5px;
    pointer-events: none; // 防止图片拦截触摸事件
    background-image: url('../../res/imgs/ic_flame_circle.png');
    background-size: 100% auto;
    // /* 修改：让宽度撑满，高度自适应 */
    // /* 背景图宽度占满容器，高度按比例缩放 */
    background-position: center;
    background-repeat: no-repeat; // Prevent image repetition

}

.circlecenter {
    background-repeat: no-repeat; // Prevent image repetition
    pointer-events: none; // 防止图片拦截触摸事件
    background-position: center;
    background-size: 100% auto;
    background-image: url('../../res/imgs/ic_main_flame_off.png');

}

.textBar {
    display: flex;
    flex-direction: row;
    margin-top: '30rpx';
}

.text1 {
    width: 100%;
    flex: 1;
}

.text2 {
    width: 100%;
    flex: 2;

}

// .slider{
//   --slider-active-background-color: #ff00ff; /* 设置滑块激活状态下的背景颜色。 */
//   --slider-inactive-background-color: #00ff00; /* 设置滑块未激活状态下的背景颜色。 */
//   --slider-disabled-opacity: 0.3; /* 设置滑块禁用状态的透明度，数值越小透明度越高。 */
//   --slider-bar-height: 2px; /* 设置滑块轨道的高度。 */
//   --slider-button-width: 24px; /* 设置滑块按钮的宽度。 */
//   --slider-button-height: 24px; /* 设置滑块按钮的高度。 */
//   --slider-button-border-radius: 50%; /* 设置滑块按钮的圆角半径，通常用来实现圆形按钮。 */
//   --slider-button-background-color: #fff; /* 设置滑块按钮的背景颜色。 */
//   --slider-button-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.5); /* 设置滑块按钮的阴影效果，可以增强立体感。 */
//   --slider-thumb-color: var(--app-B3, #ffffff); /* 设置滑块按钮的指示色，通常用于显示当前进度的指示器。 */
// }